<ion-header class="contcats-header">

  <ion-navbar hideBackButton="true">
    <ion-buttons start navPop class="back-buttons">
      <button ion-button clear></button>
    </ion-buttons>
    <ion-title>所有联系人</ion-title>
  </ion-navbar>

</ion-header>


<ion-content class="contcats-section" (ionScroll)="onScroll()">
  <div #IndexedMenu class="indexed-menu">
    <div class="indexed-item"
         [class.activated]="item === index"
         *ngFor="let item of indexes;let i = index"
         (click)="selectIndex(i)">
      {{ item }}
    </div>
  </div>

  <ion-list #scheduleList>
    <ion-item-group *ngFor="let item of formatContacts" #IonItemGroup>

      <ion-item-divider sticky index-key="item.belong">
        <ion-label>
          {{item.key}}
        </ion-label>
      </ion-item-divider>

      <ion-item-sliding *ngFor="let value of item.value | orderBy:['nameChar']" #slidingItem>
        <ion-item (click)="handleClick(value)">
          {{ value.name }}
        </ion-item>
      </ion-item-sliding>

    </ion-item-group>
  </ion-list>

  <div class="modal"
       [class.show]="showModal">
    {{index}}
  </div>
</ion-content>
